<template>
  <div class="map" id="map"></div>
</template>
<script>
// import "echarts/map/js/china.js"; // 引入中国地图数据
export default {
  name: 'appMap',
  data() {
    return {};
  },
  mounted() {
    this.drawLine();
  },
  methods: {
    drawLine() {
      let map = this.$echarts.init(document.getElementById("map"));
      // var applanePath =
      //   "path://M1705.06,1318.313v-89.254l-319.9-221.799l0.073-208.063c0.521-84.662-26.629-121.796-63.961-121.491c-37.332-0.305-64.482,36.829-63.961,121.491l0.073,208.063l-319.9,221.799v89.254l330.343-157.288l12.238,241.308l-134.449,92.931l0.531,42.034l175.125-42.917l175.125,42.917l0.531-42.034l-134.449-92.931l12.238-241.308L1705.06,1318.313z";
      // var lineData = this.map;
      // var lineData = [
      //   {
      //     bcitysim: "北京市",
      //     blat: "39.92",
      //     blon: "116.46",
      //     ecitysim: "辽宁省",
      //     elat: "41.8",
      //     elon: "123.38",
      //   },
      // ];
      map.setOption({
        // visualMap: {
        //   show:false,
        //   min: 0,
        //   max: 1000,
        //   realtime: false,
        //   calculable: true,
        //   inRange: {
        //     color: ['#00137a', '#0595d6']
        //   }
        // },
        geo: {
          map: "china",
          label: {
            normal: {
              show: true,
              fontSize: "12",
              color: "#fff"
            }
          },
          roam: false,
          zoom: 1.2, //视角缩放比例
          itemStyle: {
            borderColor: "#0688a0",
            areaColor: {
              colorStops: [
                {
                  offset: 0,
                  color: "#00137a" // 0% 处的颜色
                },
                {
                  offset: 1,
                  color: "#0595d6" // 100% 处的颜色
                }
              ]
            },
          }
        }, 
        // series: [
        //   {
        // name: "",
        // type: "lines",
        // zlevel: 1,
        // effect: {
        //   show: true,
        //   period: 6,
        //   trailLength: 0.5,
        //   symbol: planePath,
        //   symbolSize: 20,
        // },
        // lineStyle: {
        //   normal: {
        //     color: new echarts.graphic.LinearGradient(
        //       0,
        //       0,
        //       0,
        //       1,
        //       [
        //         {
        //           offset: 0,
        //           color: "#BEFF00",
        //         },
        //         {
        //           offset: 1,
        //           color: "#1DFFDB",
        //         },
        //       ],
        //       false
        //     ),
        //     width: 3,
        //     curveness: 0.1,
        //   },
        // },
        // data: data,
        //   }
        // ]
      });
    }
  }
};
</script>
<style scoped>
.map {
  width: 100%;
  height: 550px;
}
</style>